import { Card, Row, Col, Button, Form, Input, InputNumber, Switch, Tree, message, Tabs } from 'antd';
import { SaveOutlined, UsergroupAddOutlined, AlertOutlined, FileSearchOutlined } from '@ant-design/icons';
import { useState } from 'react';

const { TabPane } = Tabs;

const SystemSettings = () => {
  const [form] = Form.useForm();
  const [roleForm] = Form.useForm();

  // 角色权限树数据
  const roleTreeData = [
    {
      title: '系统管理',
      key: 'system',
      children: [
        { title: '用户管理', key: 'user-management' },
        { title: '角色权限', key: 'role-permission' },
        { title: '系统日志', key: 'system-log' },
      ],
    },
    {
      title: '业务功能',
      key: 'business',
      children: [
        { title: '患者管理', key: 'patient-management' },
        { title: '血糖监测', key: 'glucose-monitoring' },
        { title: '饮食记录', key: 'diet-records' },
        { title: '设备管理', key: 'device-management' },
        { title: '报告中心', key: 'report-center' },
      ],
    },
  ];

  // 阈值设置默认值
  const thresholdDefaults = {
    glucoseHigh: 7.0,
    glucoseLow: 3.9,
    bloodPressureHigh: 140,
    bloodPressureLow: 90,
  };

  const handleSaveThresholds = (values) => {
    console.log('保存阈值设置:', values);
    message.success('阈值设置保存成功');
  };

  const handleSaveRoles = () => {
    message.success('角色权限保存成功');
  };

  const handleSaveAudit = () => {
    message.success('审计设置保存成功');
  };

  return (
    <div>
      <h2>系统设置</h2>
      
      <Tabs defaultActiveKey="1">
        <TabPane tab={<span><AlertOutlined /> 阈值配置</span>} key="1">
          <Card>
            <Form
              form={form}
              layout="vertical"
              initialValues={thresholdDefaults}
              onFinish={handleSaveThresholds}
            >
              <Row gutter={16}>
                <Col span={12}>
                  <Card title="血糖阈值">
                    <Form.Item 
                      name="glucoseHigh" 
                      label="高血糖阈值 (mmol/L)" 
                      rules={[{ required: true }]}
                    >
                      <InputNumber min={0} step={0.1} style={{ width: '100%' }} />
                    </Form.Item>
                    <Form.Item 
                      name="glucoseLow" 
                      label="低血糖阈值 (mmol/L)" 
                      rules={[{ required: true }]}
                    >
                      <InputNumber min={0} step={0.1} style={{ width: '100%' }} />
                    </Form.Item>
                  </Card>
                </Col>
                <Col span={12}>
                  <Card title="血压阈值">
                    <Form.Item 
                      name="bloodPressureHigh" 
                      label="高血压阈值 (mmHg)" 
                      rules={[{ required: true }]}
                    >
                      <InputNumber min={0} step={1} style={{ width: '100%' }} />
                    </Form.Item>
                    <Form.Item 
                      name="bloodPressureLow" 
                      label="低血压阈值 (mmHg)" 
                      rules={[{ required: true }]}
                    >
                      <InputNumber min={0} step={1} style={{ width: '100%' }} />
                    </Form.Item>
                  </Card>
                </Col>
              </Row>
              <Form.Item>
                <Button type="primary" icon={<SaveOutlined />} htmlType="submit">
                  保存阈值设置
                </Button>
              </Form.Item>
            </Form>
          </Card>
        </TabPane>

        <TabPane tab={<span><UsergroupAddOutlined /> 角色权限</span>} key="2">
          <Card>
            <Row gutter={16}>
              <Col span={8}>
                <Card title="角色列表" size="small">
                  <div style={{ marginBottom: 16 }}>
                    <Button type="primary" block>新增角色</Button>
                  </div>
                  <div style={{ padding: '8px 0', borderBottom: '1px solid #f0f0f0' }}>系统管理员</div>
                  <div style={{ padding: '8px 0', borderBottom: '1px solid #f0f0f0' }}>医护人员</div>
                  <div style={{ padding: '8px 0', borderBottom: '1px solid #f0f0f0' }}>营养师</div>
                  <div style={{ padding: '8px 0' }}>技术支持</div>
                </Card>
              </Col>
              <Col span={16}>
                <Card title="权限配置" size="small">
                  <Tree
                    checkable
                    defaultExpandedKeys={['system', 'business']}
                    defaultCheckedKeys={['user-management', 'patient-management']}
                    treeData={roleTreeData}
                  />
                  <div style={{ marginTop: 16 }}>
                    <Button type="primary" icon={<SaveOutlined />} onClick={handleSaveRoles}>
                      保存权限设置
                    </Button>
                  </div>
                </Card>
              </Col>
            </Row>
          </Card>
        </TabPane>

        <TabPane tab={<span><FileSearchOutlined /> 日志审计</span>} key="3">
          <Card>
            <Row gutter={16}>
              <Col span={12}>
                <Card title="审计设置">
                  <Form layout="vertical">
                    <Form.Item label="日志保留天数">
                      <InputNumber min={1} max={365} defaultValue={30} />
                    </Form.Item>
                    <Form.Item label="操作日志记录" valuePropName="checked">
                      <Switch defaultChecked />
                    </Form.Item>
                    <Form.Item label="登录日志记录" valuePropName="checked">
                      <Switch defaultChecked />
                    </Form.Item>
                    <Form.Item>
                      <Button type="primary" icon={<SaveOutlined />} onClick={handleSaveAudit}>
                        保存审计设置
                      </Button>
                    </Form.Item>
                  </Form>
                </Card>
              </Col>
              <Col span={12}>
                <Card title="日志统计">
                  <div style={{ marginBottom: 16 }}>
                    <div className="kpi-label">今日操作日志</div>
                    <div className="kpi-value">128</div>
                  </div>
                  <div style={{ marginBottom: 16 }}>
                    <div className="kpi-label">本周登录次数</div>
                    <div className="kpi-value">42</div>
                  </div>
                  <div>
                    <div className="kpi-label">本月系统错误</div>
                    <div className="kpi-value" style={{ color: '#f5222d' }}>3</div>
                  </div>
                </Card>
              </Col>
            </Row>
          </Card>
        </TabPane>
      </Tabs>
    </div>
  );
};

export default SystemSettings;
